<template>
  <div class="resume-container">
    <div class="upload-area">
      <label for="resume-upload">上传简历文件（支持PDF、Word格式）：</label>
      <input
        id="resume-upload"
        type="file"
        accept=".pdf,.doc,.docx"
        @change="handleFileUpload"
      >
      <button
        @click="submitResume"
        :disabled="!selectedFile"
      >
        提交评估
      </button>
    </div>

    <!-- 加载状态 -->
    <div class="loading" v-if="isLoading">
      正在评估您的简历，请稍候...
    </div>

    <!-- 评估结果 -->
    <div class="evaluation-result" v-if="evaluationResult">
      <h3>简历评估结果</h3>
      <div class="result-content">
        {{ evaluationResult }}
      </div>
    </div>
  </div>
</template>

<script>
import api from '../services/api'

export default {
  name: 'Resume',
  data() {
    return {
      selectedFile: null,
      isLoading: false,
      evaluationResult: null,
      positionId: 1, // 示例职位ID，根据实际情况获取
      conversationId: null // 添加会话ID
    }
  },
  methods: {
    handleFileUpload(e) {
      this.selectedFile = e.target.files[0]
    },

    async submitResume() {
      if (!this.selectedFile) return

      try {
        this.isLoading = true
        this.evaluationResult = null

        // 1. 创建 FormData 对象
        const formData = new FormData()

        // 2. 添加文件
        formData.append('resume', this.selectedFile)

        // 3. 添加其他表单字段
        formData.append('position_id', this.positionId)

        // 4. 添加会话ID（如果有）
        if (this.conversationId) {
          formData.append('conversation_id', this.conversationId)
        }

        // 5. 设置正确的 Content-Type
        const config = {
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        }

        // 6. 调用 API
        const response = await api.resume.evaluate(formData, config)

        // 7. 处理响应
        if (response.data.success) {
          this.evaluationResult = response.data.evaluation

          // 8. 更新会话ID（如果有）
          if (response.data.conversation_id) {
            this.conversationId = response.data.conversation_id
          }
        }
      } catch (error) {
        console.error('简历评估失败:', error)

        // 显示更详细的错误信息
        if (error.response) {
          alert(`错误: ${error.response.data.error || error.response.statusText}`)
        } else {
          alert('网络错误，请检查连接')
        }
      } finally {
        this.isLoading = false
      }
    }
  }
}
</script>

<style>
.resume-container {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.upload-area {
  margin-bottom: 20px;
  padding: 15px;
  border: 1px dashed #ccc;
  border-radius: 4px;
}

.upload-area input {
  margin: 0 10px;
}

.upload-area button {
  padding: 8px 16px;
  background-color: #42b983;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.upload-area button:disabled {
  background-color: #ccc;
  cursor: not-allowed;
}

.loading {
  text-align: center;
  padding: 20px;
  color: #666;
}

.evaluation-result {
  flex: 1;
  margin-top: 20px;
  padding: 15px;
  border: 1px solid #eee;
  border-radius: 4px;
}

.result-content {
  margin-top: 10px;
  line-height: 1.6;
  color: #333;
}
</style>